<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta name="viewport" content="width=device-width, initial-scale=0.3, minimum-scale=0.1, maximum-scale=1.0, user-scalable=yes" />
    <!--<meta http-equiv="Cache-Control" content="max-age=180" />
    <meta name="renderer" content="webkit|ie-comp|ie-stand" />
    <meta http-equiv="x-dns-prefetch-control" content="on" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="apple-mobile-web-app-status-bar-style" content="black" />
    <meta name="format-detection" content="telephone=no" />-->
    <link rel="stylesheet" href="./css/share.css">
    <link rel="stylesheet" href="./css/second.css">
    <script src="https://cdn.staticfile.org/jquery/1.8.3/jquery.min.js">
    </script>
    <title>Document</title>
</head>
<body>
    <div class="topbox " >
        <div class="top">
            <div class="logo">
                <a href="http://www.mymrmao.com">
                    <img src="./img/logo.png" alt="猫先生">
                </a>
            </div>
            <div class="nav">
                <ul style="float: left;">
                    <li id="li_1" class="">
                        <div class="bm">
                            <a href="#" style="width: 130px;">垃圾分类首页</a>
                        </div> 
                    </li>
                    <li id="li_2" class="">
                        <div class="bm">
                            <a href="#">资讯动态</a>
                        </div>
                    </li>
                    <li id="li_3">
                        <div class="bm">
                            <a href="#">硬件产品</a>
                        </div>
                        <div class="thing">
                            <ul>
                                <li><a href="">智能垃圾房</a></li>
                                <li><a href="">智能分享类</a></li>
                                <li><a href="">智能回收站</a></li>
                                <li><a href="">智能垃圾箱</a></li>
                                <li><a href="">智能兑换机</a></li>
                            </ul>
                        </div>
                    </li>
                    <li id="li_4">
                        <div class="bm">
                            <a href="#">软件系统</a>
                        </div>
                        <div class="thing">
                            <ul>
                                <li><a href="">华展环境云</a></li>
                                <li><a href="">数据中心</a></li>
                                <li><a href="">猫先生APP</a></li>
                                <li><a href="">猫回收APP</a></li>
                            </ul>
                        </div>
                    </li>
                    <li id="li_5">
                        <div class="bm">
                            <a href="#">运营方案</a>
                        </div>
                        <div class="thing">
                            <ul>
                                <li><a href="">猫回收</a></li>
                                <li><a href="">清运标准化</a></li>
                                <li><a href="">分拣中心</a></li>
                                <li><a href="">合作细则</a></li>
                            </ul>
                        </div>
                    </li>
                    <li id="li_6" class="move">
                        <div class="bm">
                            <a href="#">代理加盟</a>
                        </div>
                    </li>
                    <li id="li_7">
                        <div class="bm">
                            <a href="#">联系我们</a>
                        </div>
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <div class="container"> 
        <img src="./img/1.png" alt="" >
        <img src="./img/2.png" alt="" >
        <img src="./img/3.png" alt="" >
        <img src="./img/4.png" alt="" >
        <img src="./img/5.png" alt="" >
        <img src="./img/6.png" alt="" >
        <img src="./img/7.png" alt="" >
        <img src="./img/8.png" alt="" >
        <img src="./img/9.png" style="display:  block;" alt="" >
    </div>
    <div class="footer" >
        <div class="f_top">
            <div class="f_top_left">
                <div class="phone">
                    <img src="./img/phone.png" alt="" style="margin-top: 10px;">
                    <span class="sp1">联系我们</span></br>
                    <strong class="p1">18380161307</strong>
                    <p style="color: #e0e0e0;" class="p2">周一至周日：9:00~18:00</p>
                </div>
                <div class="address">
                    <img src="./img/address.png" alt="">
                    <span class="sp1">公司地址</span>
                    <p style="color: #e0e0e0;" class="p3">江苏省南京市北纬国际中心B座3层</p>
                    <p style="color: #e0e0e0;" class="p3">江苏省宿迁市高新技术开发区开发大道101号</p>
                </div>
                <div class="email">
                    <img src="./img/email.png" alt="">
                    <span class="sp1">合作邮箱</span>
                    <p style="color: #e0e0e0;" class="p3">service@myhuazhan.com</p> 
                </div>
                <div class="friend">
                    <img src="./img/href.png" alt="">
                    <span class="sp1">友情链接</span>
                    <p class="p3">   
                            <a style="color: #e0e0e0;" href="http://www.myhuazhan.com/" target="_blank">华展股份官网</a> 
                            <a style="color: #e0e0e0;" href="http://www.adccb.cn" target="_blank">华展候车亭</a>
                            <a style="color: #e0e0e0;" href="" target="_blank">垃圾分类服务商</a>
                    </p>
                    <p class="p3">
                        <a style="color: #e0e0e0;" href="" target="_blank">智能垃圾分类</a>
                        <a style="color: #e0e0e0;" href="http://www.chinaenvironment.com" target="_blank">中国环保网</a>
                        <a style="color: #e0e0e0;" href="http://hbt.jiangsu.gov.cn" target="_blank">江苏省生态环境厅</a> 
                    </p>
                    <p class="p3">
                        <a style="color: #e0e0e0;" href="http://huanbao.bjx.com.cn" target="_blank">北极星环保网</a>
                        <a style="color: #e0e0e0;" href="https://www.cn-hw.net" target="_blank">环卫科技网</a>
                        <a style="color: #e0e0e0;" href="" target="_blank">垃圾分类</a> 
                    </p>
                </div>
            </div>
            <div class="f_top_right" >
                <div class="rimg">
                    <img src="./img/wx.jpg" alt="wx">
                    <h2>微信公众号</h2>
                </div>
                <div class="rimg">
                    <img src="./img/wb.png" alt="wb">
                    <h2>新浪微博</h2>
                </div>
                <div class="rimg">
                    <img src="./img/app.png" alt="">
                    <h2>手机APP下载</h2>
                </div>
            </div>
        </div>
        <div class="f_bottom">
            <div class="endnote">
               <span>2020 版权所有 © 南京猫先生环保科技有限公司; </span> 
               <a href="#" target="_blank">苏ICP备19005644号</a> 
            </div>
            <button class="b1">返回顶部</button>
        </div>
    </div> 
    <div class="question">
            <img src="./img/question.png" alt="">
    </div>
     <div class="leave_word">
        <div class="l_top">
            <span class="span1">请您留言</span>
              <button class="b2" id="1">－<button>
        </div>
        <div class="l_bottom">
            <div class="tele">
                <p>南京猫先生环保科技有限公司</p>
                <p>咨询热线：400-119-7080</p>
            </div>
            <textarea name="" id="" cols="20" rows="5" required placeholder="请在此输入留言内容,&#10我们会尽快与您联系。（必填）"></textarea> 
            <input type="text" placeholder="姓名" style="margin: 5px 0;"><br>
            <input type="text" placeholder="电话（必填）"><br>
            <input type="text" placeholder="地址 " style="margin: 5px 0;"><br>
            <input type="submit" value="发送" style="background-color: blue; padding: 10px 10px;">
        </div>
    </div> 
</body>
<!-- 下拉菜单 -->
<script>
    $(function () {
            var dl = $(".nav li.move");
            $(".nav li").mousemove(function () {
                $(".nav li").removeClass("move");
                $(this).addClass("move");
                $(this).children(".thing").show();
            });
            $(".nav li").mouseleave(function () {
                $(this).removeClass("move");
                $(this).children(".thing").hide();
                dl.addClass("move");
            });
        });
</script>
<!-- 选中菜单 -->
<script>
    $(".nav li").mouseenter(function(){  //找到class为nav的盒子下面的li标签 给他一个鼠标移入函数
        $(".nav li").removeClass("move"); //鼠标移入时把class为nav的盒子下面的li标签的class属性值为move的删掉
        $(this).addClass("move");//给鼠标移入的这个li标签增加一个class属性值为move
    })
</script>
<!-- 顶部背景 -->
<script>
    $(document).ready(function () {
            $(window).scroll(function () {
                var top = 30; 
                var scrollTop = $(window).scrollTop();  
                if (scrollTop > top) {                 
                    $(".topbox").addClass("active");
                } else {
                    $(".topbox").removeClass("active");
                }
            });
        });
</script>
<!-- 留言板样式 -->
<script>
    let i = 0;
   $('.b2').click(function(){
         i++;
        if(i%2==1){
            $(this).html('□');
            $(".l_bottom").css("display","none");
            $(".l_top").addClass("l_ttop");
        }
        else{
            $(this).html('－');
            $(".l_bottom").css("display","block");
            $(".l_top").removeClass("l_ttop");
            $(".leave_word").removeClass("leave_word1")
        }
   })
</script>
<!-- 返回顶部 -->
<script>
    $(function () {
            $('.b1').click(function () {
                $('html, body').animate({ scrollTop: 0 }, 'slow');
            });
        });
</script>
<!-- 点我咨询 -->
<script>
    $(".question").click(function(a){
        $(".leave_word").addClass("leave_word1");
        $(".b2").html('－');
        $(".l_bottom").css("display","block");
        $(".l_top").removeClass("l_ttop");
    })
</script>
</html>